<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>Event Handling</title>
	<script type="text/javascript">
		var eventCtrl = {
				add: function(elem, eventType, handler) {
					eventType = eventType.replace('on', '');
					if (elem.addEventListener) {
						elem.addEventListener(eventType, handler, false);
					} else if (elem.attachEvent) {
						eventType = 'on' + eventType;
						elem.attachEvent(eventType, handler);
					}
				},
				remove: function(elem, eventType, handler){
					eventType = eventType.replace('on', '');
					if (elem.removeEventListener) {
						elem.removeEventListener(eventType, handler);
					} else if (elem.detachEvent) {
						eventType = 'on' + eventType;
						elem.detachEvent(eventType, handler);
					}
				}
		};
		eventCtrl.add(window, 'load', function(event){
			var time = 0;
			var button = document.getElementsByTagName('button')[0];
			eventCtrl.add(button, 'click', function(event){
				if (time > 0) {
					document.getElementById('msContent').innerHTML = event.timeStamp - time;
				}
				time = event.timeStamp;
			});
		});
	</script>
</head>
<body>
	<h1>이벤트 핸들링</h1>
	<div>클릭한 간격 : <span id="msContent">0</span> 밀리초</div>
	<button type="button">클릭</button>
</body>
</html>
